import { defineStore } from "pinia";
import {
  computed,
  onMounted,
  onUnmounted,
  reactive,
  ref,
  toRaw,
  watch,
} from "vue";
import { useQuasar, uid } from "quasar";
import { date } from "quasar";

export const useSettings = defineStore("settings", {
  // 为了完整类型推理，推荐使用箭头函数
  state: () => {
    const $q = useQuasar();
    const data = reactive({
      todo: {
        十二小时制: true,
        隐藏头部: true,
      },
    });

    function 储存数据() {
      // console.log("保存todos", todos);
      try {
        $q.localStorage.set("settings", data);
        $q.notify({
          type: "positive",
          message: `保存成功`,
          timeout: 1,
        });
      } catch (e) {
        // $q.notify({
        //   type:"warning",
        //   message: `保存缓存失败 ${e}`,
        //   timeout:0,
        //   closeBtn:"关闭"
        // });
      }
    }

    function 读取数据() {
      const 储存的数据 = $q.localStorage.getItem("settings");
      if (typeof 储存的数据 === "object" && 储存的数据 !== null) {
        Object.assign(data, 储存的数据);
        // $q.notify({
        //   type:"positive",
        //   message: `成功`,
        //   timeout: 1,
        // });
      }
    }
    onMounted(() => {
      读取数据();
    });

    //
    watch(data, () => {
      储存数据();
    });

    return {
      data,
    };
  },
});
